<extend name="Base/common"/>
<block name="head_css">
<link href="__PUBLIC__/Green/css/usercenter.css" rel='stylesheet' type='text/css' />
</block>
<block name="head_script">
<script type="text/javascript" src="__PUBLIC__/Green/js/usercenter.js"></script>
</block>
<block name="body">
    <div class="width1000">
        <div class="top_tit">
            <a href="{:U('User/index')}">用户中心</a> 
        </div>
        <div class="clearfix relative">
            <include file="User/nav" />
            <div class="user_center">
                <div class="user_profit">
                    <div class="profit_top">
                        <div class="profit_money">
                            <div class="total">
                                <div class="title">账户余额</div>                        
                                <div>
                                <span class="money">
                                    {$total_money|default=0}
                                </span><span class="unit">车币</span>
                                </div>
                            </div>
                            <div class="list">
                                <p>可用车币：<span class="money_normal">{$cash_money|default=0}</span></p>
                                <p>冻结车币：<span class="money_frozen">{$freeze_money|default=0}</span></p>
                            </div>
                        </div>
                        <div class="cash">
                            <a href="{:U('User/exchange')}" class="btn_hover profit_money_btn">兑换</a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div id="chart_pie1">
                    </div>
                    <div id="chart_pie2">
                    </div>
                    <div id="chart_line">
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="user_order_list">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>车牌号码</th>
                                <th>保单号码</th>
                                <th>产品名称</th>
                                <th>有效日期</th>
                                <th>状态</th>
                            </tr>
                        </thead>
                        <tbody>
                        <empty name="orders">
                            
                       		<tr>
                        	<td colspan="5"  style="text-align: center">
                            <div style="margin-top: 30px;font-size: 16px;"><img alt="" src="__PUBLIC__/Green/images/no_order.png"><span style="padding-left: 10px;">暂无生效的保单</span> </div>
                            	
                           <div style="margin-top: 20px;font-size: 16px;"> <a href="{:U('Insurance/index')}" class="i_add buy_btn">立即购险</a></div>
                           </td>
                           </tr>
                        <else />
                        <volist name="orders" id="item">
                            <tr>
                                <td>{$item.car_no}</td>
                                <td><volist name="item.policyno" id="policy">{$policy}<br /></volist></td>
                                <td>{$item.product_name}</td>
                                <td>{$item.start_date} 至 {$item.end_date}</td>
                                <td>
                                <switch name="item.status">
                                    <case value="0"><a href="{$Think.config.CIC_PAY_URL}{$item.c_order_no}" class="no_pay" target="cash_target">未支付</a></case>
                                    <case value="1"><a href="javascript:void(0);" class="has_pay">已支付</a></case>
                                    <case value="2"><a href="javascript:void(0);" class="has_pay">已生成保单</a></case>
                                    <case value="3"><a href="javascript:void(0);" class="has_pay">已结束</a></case>
                                </switch>                                
                                </td>
                            </tr>
                        </volist>
                        </empty>
                        </tbody>
                    </table>
                    {$_page}
                </div>
            </div>
        </div>
    </div>
</block>    
<block name="script">
<script type="text/javascript" src="__PUBLIC__/Green/js/insurance.js"></script>
<script src="__PUBLIC__/js/echarts/echarts.js"></script>
    <script type="text/javascript">
        require.config({
            paths: {
                echarts: '__PUBLIC__/js/echarts'
            }
        });
        require(
            [
                'echarts',
                'echarts/chart/line',
                'echarts/chart/pie'
            ],
            function (ec) {
                var chart_line = ec.init(document.getElementById('chart_line')),
                    chart_pie1 = ec.init(document.getElementById('chart_pie1')),
                    chart_pie2 = ec.init(document.getElementById('chart_pie2')); 
                
                var labelFromatter = {
                    normal : {
                        label : {
                            formatter : function (params){
                                return params.value;
                            },
                            textStyle: {
                                fontSize: 18,
                                baseline : 'top'
                            }
                        }
                    },
                }
                var labelTop = {
                    normal : {
                        label : {
                            show : true,
                            position : 'center',
                            formatter : '{b}',
                            textStyle: {
                                baseline : 'bottom',
                                fontSize: 14
                            }
                        },
                        labelLine : {
                            show : false
                        }
                    }
                };
                var labelBottom = {
                    normal : {
                        color: '#ccc',
                        label : {
                            show : true,
                            position : 'center'
                        },
                        labelLine : {
                            show : false
                        }
                    },
                    emphasis: {
                        color: 'rgba(0,0,0,0)'
                    }
                };
                var fontStyle = {
                    fontFamily:'"Microsoft YaHei", 微软雅黑, "Microsoft JhengHei", 华文细黑,"SimHei", STHeiti, MingLiu',
                    color:'#616161',
                    fontWeight:'normal'                    
                };
                var radius = [60, 80];
                var option_pie1 = {
                    title:{
                        text:'基本奖励{$day_amt|default=0}车币/日',
                        x:'center',
                        textStyle:fontStyle
                    },
                    series : [
                        {
                            type : 'pie',
                            radius : radius,
                            x: '0%', // for funnel
                            itemStyle : labelFromatter,
                            data : [
                                {name:'other', value:{$chartline[6]['jb']}, itemStyle : labelBottom},
                                {name:'基本奖励', value:0.01,itemStyle : labelTop}
                            ]
                        }
                    ]
                };
                    
                var option_pie2 = {
                    title:{
                        text:'环保奖励{$day_frozen_amt|default=0}车币/日',
                        x:'center',
                        textStyle:fontStyle
                    },
                    series : [
                        {
                            type : 'pie',
                            radius : radius,
                            x:'20%', // for funnel
                            itemStyle : labelFromatter,
                            data : [
                                {name:'other', value:{$chartline[6]['hb']}, itemStyle : labelBottom},
                                {name:'环保奖励', value:0.01,itemStyle : labelTop}
                            ]
                        }
                    ]
                };
                    
                var option_line = {
                    title : {
                        text: '7日收益',
                        x:'center',
                        textStyle:fontStyle
                    },
                    grid:{
                        x:25,
                        y:35,
                        x2:25,
                        y2:25  
                    },
                    tooltip : {
                        trigger: 'axis'
                    },
                    xAxis : [
                        {
                            type : 'category',
                            boundaryGap : false,
                            data : [<volist name="chartline" id="vo"><gt name="i" value="1">,</gt>'{$vo.date}'</volist>]
                        }
                    ],
                    yAxis : [
                        {
                            type : 'value',
                            axisLabel : {
                                formatter: '{value}'
                            }
                        }
                    ],
                    series : [
                        {
                            name:'基本奖励',
                            type:'line',
                            data:[<volist name="chartline" id="vo"><gt name="i" value="1">,</gt>{$vo.jb}</volist>]
                        },
                        {
                            name:'环保奖励',
                            type:'line',
                            data:[<volist name="chartline" id="vo"><gt name="i" value="1">,</gt>{$vo.hb}</volist>]
                        },
                        {
                            name:'总奖励',
                            type:'line',
                            data:[<volist name="chartline" id="vo"><gt name="i" value="1">,</gt>{$vo.hj}</volist>]
                        }
                    ]
                };
                    
                chart_pie1.setOption(option_pie1); 
                chart_pie2.setOption(option_pie2); 
                chart_line.setOption(option_line);
            }
        );
        
        highlight_nav("{:U('User/index')}");
    </script>
</block>
